<!DOCTYPE html>
<html lang="zh_CN" class="x-admin-sm" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>回收站</title>
    <header th:replace="header::html"></header>
</head>
<body>
<div class="x-body">
    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-body ">
                        <table class="layui-hide" id="table" lay-filter="member"></table>
                    </div>
                    <div class="layui-card-body ">
                        <script type="text/html" id="barDemo">
                            <a class="layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon">&#xe66c;</i>还原</a>
                            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon">&#xe640;</i>彻底删除</a>
                        </script>
                    </div>
                    <div class="layui-card-body ">
                        <script type="text/html" id="toolbarDemo">
                            <div class="layui-btn-container">
                            </div>
                        </script>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    layui.use('table', function () {
        $ = layui.jquery;
        var table = layui.table,
            form = layui.form;
        var tableIns = table.render({
            elem: '#table'
            , url: '/mail/recycleList' //数据接口
            , toolbar: '#toolbarDemo'
            , response: {
                dataName: 'datas' //规定数据列表的字段名称，默认：data
            }
            , cols: [
                [ //表头
                    {field: 'id', title: 'ID', sort: true, width: 80, align: "center"},
                    {field: 'address', title: '收件人'},
                    {field: 'title', title: '主题名称'},
                    {field: 'createTime', title: '发送时间'},
                    {field: 'sizeValue', title: '大小'},
                    {
                        field: 'deleted', title: '状态', templet: function (d) {
                            if (d.deleted == '0') {
                                return '<span class="layui-badge layui-bg-blue">未删除</span>';
                            }
                            return '<span class="layui-badge layui-bg-gray">已删除</span>';
                        }
                    },
                    {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 190}
                ]
            ]
        });

        //监听工具条
        table.on('tool(member)', function (obj) {
            var data = obj.data;
            if (obj.event === 'del') {
                layer.confirm('真的删除行么?', function (index) {
                    $.ajax({
                        url: "/mail/deleteRecycle",
                        type: "GET",
                        data: {id: data.id},
                        dataType: 'json',
                        success: function (result) {
                            if (result.code == 200) {
                                layer.alert("删除成功", {icon: 1}, function (index1) {
                                    layer.close(index1);
                                    tableIns.reload();
                                });
                            } else {
                                layer.alert(result.msg);
                            }
                        },
                    });
                });
            } else if (obj.event === 'edit') {
                //还原处理
                layer.confirm('真的还原么?', function (index) {
                    $.ajax({
                        url: "/mail/reduce",
                        type: "GET",
                        data: {id: data.id},
                        dataType: 'json',
                        success: function (result) {
                            if (result.code == 200) {
                                layer.alert("还原成功，已恢复", {icon: 1}, function (index1) {
                                    layer.close(index1);
                                    tableIns.reload();
                                });
                            } else {
                                layer.alert(result.msg);
                            }
                        },
                    });
                });
            }
        })
    });
</script>
</body>
</html>

